<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>Document</title>
		<script src="js/xys.js"></script>
		<link rel="stylesheet" href="css/style.css" />
	</head>
	<body>
		<!-- 
        需求：
        1/移动端为主，pc端可用
        2/输入框：输入代办事项
        3/未成列表：能够显示出未完成的内容，已经可以对每一项内容。进行修改/删除
        4/完成列表：能够显示完成的内容，可以对每一项内容进行修改（改成未完成、删除））

        项目制作顺序：
        1/写html结构
        2/css样式
        3/JavaScript功能
            输入框的输入功能
            未完成列表的显示功能
            完成列表的显示功能
            修改和删除列表的功能
        -->

		<!-- .main>(.header>((.logo{todo}+input))+(.doing>(h3>(span.title{正在进行})+span.number)+.list))+(.done>(h3>(span.title{已经完成})+span.number)+.list) -->
		<div class="main">
			<div class="header">
				<div class="logo">事件列表</div>
				<input type="text" placeholder="添加事件" id="input" />
			</div>
			<div class="doing todo">
				<h3>
					<span class="title"> 正在进行</span>
					<span class="num numDoing">0</span>
				</h3>
				<div class="list">
                    <!-- <div class="todoItem">
                        <input type="checkbox">
                        <div class="content">恰烧烤</div>
                        <div class="del">删除</div>
                    </div> -->
                </div>
			</div>
			<div class="done todo">
				<h3>
                    <span class="title">已经完成</span>
                    <span class="num numDone">0</span>
				</h3>
				<div class="list">
                    <!-- <div class="todoItem">
                        <input type="checkbox" checked="checked">
                        <div class="content">恰汉堡</div>
                        <div class="del">删除</div>
                    </div> -->
                </div>
			</div>
        </div>
        
        <script src="js/index.js"></script>
	</body>
</html>
